<template>
  <div id="dataDetails">
    <header>治理信息表</header>
    <div class="listData">
      <div
        style="
          display: flex;
          justify-content: center;
          align-items: center;
          color: black;
          border-bottom: 1px solid #d2d2d2;
        "
      >
        <van-field
          readonly
          clickable
          name="picker"
          v-model="sexName"
          label="治理方式"
          placeholder="请选择治理方式"
          @click="ENUM.XB = true"
        />
        <van-popup v-model="ENUM.XB" position="bottom" get-container="#popup">
          <van-picker
            show-toolbar
            :columns="ENUM.XBARR"
            value-key="DICNAME"
            @confirm="onConfirm5"
            @cancel="ENUM.XB = false"
          />
        </van-popup>
      </div>
      <div
        style="
          display: flex;
          justify-content: center;
          align-items: center;
          color: black;
          border-bottom: 1px solid #d2d2d2;
        "
      >
        <van-field :readonly="isread" v-model="JFData.APPLYPHONE" label="办理人" placeholder="请填写办理人" />
      </div>
      <div
        style="
          display: flex;
          justify-content: center;
          align-items: center;
          color: black;
          border-bottom: 1px solid #d2d2d2;
        "
      >
        <van-field :readonly="isread" v-model="JFData.APPLYPHONE" label="办理时间" placeholder="请填写办理时间" />
      </div>
    </div>
    <footer>
      <van-button type="info" style="width: 90vw"> 提交 </van-button>
    </footer>
  </div>
</template>

<style scoped lang="scss">
#dataDetails {
  height: 100vh;
  width: 100vw;
  overflow: auto;
  padding: 10px;
  header {
    text-align: center;
    font-size: 18px;
    font-weight: 700;
  }
  footer {
    position: fixed;
    bottom: 34px;
    left: 50%;
    transform: translateX(-50%);
  }
}
</style>

<script>
import dd from 'gdt-jsapi'
export default {
  data() {
    return {
      JFData: {
        APPLYPHONE: '',
      },
      isread: false,
      ENUM:{

      },
      onConfirm5:[],
      sexName:""
    }
  },
  mounted() {
    dd.ready(function () {
      dd.setTitle({
        title: '详情',
      })
        .then((res) => {})
        .catch((err) => {
          console.error(err)
        })
    })
  },
}
</script>
